<template>
	<div class="First_qj">
		<div class="First_s">
			<div class="s_tb">
				<img class="tb1" src="../assets/Main/dw.jpg" />
				<span>北京理工大学国防科技园2号楼10层</span>
				<img class="tb2" src="../assets/Main/xx.png" />
			</div>
			<div class="s_ssk">
				<div class="ssk" @click="ss">
					<img src="../assets/jft_but_search.png" />
					<span class="ssk_text">山姆会员商店优惠商品</span>
				</div>
			</div>
			<div class="s_tp">
				<img src="../assets/Main/sytp.jpg" />
			</div>
			<div class="s_fl">
				<div class="fl">
					<img src="../assets/Main/超市.png" />
					<span>超市便利</span>
				</div>
				<div class="fl">
					<img src="../assets/Main/菜市场.png" />
					<span class="fl_text">菜市场</span>
				</div>
				<div class="fl">
					<img src="../assets/Main/水果店.png" />
					<span class="fl_text">水果店</span>
				</div>
				<div class="fl">
					<img src="../assets/Main/鲜花.png" />
					<span>鲜花绿植</span>
				</div>
				<div class="fl">
					<img src="../assets/Main/医药健康.png" />
					<span>医药健康</span>
				</div>
			</div>
			<div class="s_fl">
				<div class="fl">
					<img src="../assets/Main/家居.png" />
					<span>家具时尚</span>
				</div>
				<div class="fl">
					<img src="../assets/Main/蛋糕.png" />
					<span>烘培蛋糕</span>
				</div>
				<div class="fl">
					<img src="../assets/Main/签到.png" />
					<span class="fl_text1">签到</span>
				</div>
				<div class="fl">
					<img src="../assets/Main/大牌免运.png" />
					<span>大牌免运</span>
				</div>
				<div class="fl">
					<img src="../assets/Main/红包.png" />
					<span>红包套餐</span>
				</div>
			</div>
		</div>
		<div class="First_x">
			<div class="x_bt">
				<span>附近店铺</span>
			</div>
			<div class="dp" @click="tzxq">
				<img src="../assets/Main/sp1.jpg" alt="">
				<div class="dp_bt">
					<span class="dp_text">沃尔玛</span>
					<div class="dp_text2">
						<span>月售1万+</span>
						<span> 起送￥0</span>
						<span>基础运费￥5</span>
					</div>
					<span class="dp_text3">VIP尊享满89元减4元运费卷(每月3张)</span>
				</div>
			</div>
			<div class="dp" @click="tzxq">
				<img src="../assets/Main/sp2.jpg" alt="">
				<div class="dp_bt">
					<span class="dp_text">山姆会员商店</span>
					<div class="dp_text2">
						<span>月售2千+</span>
						<span> 起送￥0</span>
						<span>基础运费￥5</span>
					</div>
					<span class="dp_text3">联合利华洗护满10减5</span>
				</div>
			</div>
		</div>
	</div>
</template>

<script>
	export default {
		methods: {
			tzxq() {
				this.$router.push('/ProductDel')
			},
			ss(){
				this.$router.push('/Search')
			}
		}
	}
</script>

<style>
	.dp_text3{
		color: red;
		font-size: 13px;
	}
	.dp_text2 span{
		margin-right: 16px;
	}
	.dp_text2{
		margin-top: 8px;
		margin-bottom: 8px;
		font-size: 13px;
	}
	.dp_text{
		font-size: 16px;
	}
	.dp_bt{
		margin-top: 14px;
		margin-left: 16px;
	}
	.dp img{
		width: 56px;
		height: 56px;
		margin-left: 18px;
		margin-top: 14px;
	}
	.dp{
		display: flex;
	}
	.x_bt span{
		font-size: 18px;
	}
	.x_bt{
		padding-top: 16px;
		margin-left: 18px;
	}
	.First_x{
		background-color: #FFFFFF;
		margin-top: 10px;
	}
	.fl_text1{
		padding-left: 10px;
	}
	.fl_text{
		padding-left: 4px;
	}
	.fl span{
		font-size: 12px;
		margin-left: 3px;
	}
	.fl img{
		height: 40px;
		width: 40px;
		margin-bottom: 6px;
		margin-left: 6px;
		display: flex;
		flex-direction:column;
	}
	.fl{
		width: 100px;
		margin-top: 16px;
		margin-left: 16px;
		margin-bottom: 16px;
		margin-right: 16px;
	}
	.s_fl{
		margin-left: 10px;
		margin-right: 10px;
		display: flex;
		justify-content: space-between;
	}
	.s_tp img{
		height:86px;
		width: 100%;
	}
	.s_tp{
		margin-top: 12px;
		margin-left: 18px;
		margin-right: 18px;
	}
	.ssk span{
		font-size: 14px;
		color: #e0e0e0;
		margin-left: 12px;
	}
	.ssk img{
		height: 16px;
		width: 16px;
		margin-left: 16px;
		margin-bottom: -3px;
	}
	.s_ssk{
		display: flex;
		align-items: center;
		border-radius: 20px;
		background-color: #F8F8F8;
		margin-left: 18px;
		margin-top: 16px;
		margin-right: 18px;
		height: 32px;
	}
	.s_tb span{
		font-size: 16px;
	}
	.s_tb{
		background-color: #FFFFFF;
		text-align: center;
		margin-top: 16px;
	}
	.tb1{
		float: left;
		margin-left: 19px;
		width: 16.1px;
		height: 16.2px;
	}
	.tb2{
		float: right;
		margin-right: 18px;
		width: 18px;
		height: 19px;
	}
	.First_s{
		background-color: #FFFFFF;
	}
	.First_qj{
		background-color: #F8F8F8;
	}
</style>